<template>
  <div class="app_body">
    <div v-if="headerShow">
      <GlobalHeader :navData="loginState"></GlobalHeader>
    </div>
    <router-view></router-view>
    <div v-if="footShow">footer</div>

  </div>
  
</template>

<script lang="ts">
import { defineComponent, ref,computed } from "vue";
import {useRoute} from 'vue-router'
import {useStore} from 'vuex'
import GlobalHeader,{NavProps} from './components/globalHeader/globalHeader.vue'
import isBarShow from './hooks/isBarShow'

export default defineComponent({
  name: "App",
  components: {
    GlobalHeader,
  },
  setup(props,context){
    const {headerShow,footShow} = isBarShow()
    const store = useStore()
    const loginState = computed(()=>store.state.user)
    // console.log('from app',store)
    return {
      loginState,
      headerShow,
      footShow
    }
  }
});
</script>

<style lang="less">
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}
.app_body{

}
</style>
